<template>
	<view class="modular">
		<view class="headerBox">
			<view class="header">
				<view class="information">
					<view>
						<view><text>会员</text>：{{data.userName}} </view>
						<view><text>填写日期</text>：{{data.fillFormDate}}</view>
					</view>
					<view>
						<view><text>性别</text>：{{userInfo.sex && userInfo.sex == 1 ? '男' : '女' || ''}} </view>
						<view><text>年龄</text>：{{userInfo && userInfo.age}}</view>
					</view>
					<view>
						<view><text>评估人</text>：{{data.healthName}}</view>
						<view><text>评估日期</text>：{{data.modifiedDate ? data.modifiedDate : data.createdDate}}</view>
					</view>
				</view>
			</view>
			
			<view class="connectBox" v-show="!searchBarFixed">
				<image src="@/static/img/healthStatus/connect@2x.png"></image>
				<image src="@/static/img/healthStatus/connect@2x.png"></image>
			</view>
		</view>
		<view class="mainContent">
			<view class="specific">
				<image src="@/static/img/healthStatus/lifeStyle1@2x.png" class="title"></image>
				<view class="single" v-for="(item,index) in subjectArr[0] && subjectArr[0].adTopicsRepliesEntityList" :key="index">
					<image src="@/static/img/healthStatus/questionIcon@2x.png"></image>
					<view>
						<view class="question">{{item.name}}</view>
						<view class="answer" v-if="brr1[index] && brr1[index].userOption !== '' ">
							{{brr1[index] && brr1[index].userOption === '' ? '未选择':
								item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr1[index].userOption})[0]?item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr1[index].userOption})[0].value : '未选择'
							}}
						</view>
					</view>
				</view>
			</view>
			
			<view class="specific">
				<image src="@/static/img/healthStatus/lifeStyle2@2x.png" class="title"></image>
				<view class="single" v-for="(item,index) in subjectArr[1] && subjectArr[1].adTopicsRepliesEntityList" :key="index">
					<image src="@/static/img/healthStatus/questionIcon@2x.png"></image>
					<view>
						<view class="question">{{item.name}}</view>
						<view class="answer" v-if="brr2[index] && brr2[index].userOption !== '' ">
						{{brr2[index] && brr2[index].userOption === '' ? '未选择':
							item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr2[index].userOption})[0]?item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr2[index].userOption})[0].value : '未选择'
						}}
						</view>
					</view>
				</view>
			</view>
			
			<view class="specific">
				<image src="@/static/img/healthStatus/lifeStyle3@2x.png" class="title"></image>
				<view class="single" v-for="(item,index) in subjectArr[2] && subjectArr[2].adTopicsRepliesEntityList" :key="index">
					<image src="@/static/img/healthStatus/questionIcon@2x.png"></image>
					<view>
						<view class="question">{{item.name}}</view>
						<view class="answer" v-if="brr3[index] && brr3[index].userOption !== '' ">
							{{brr3[index] && brr3[index].userOption === '' ? '未选择':
								item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr3[index].userOption})[0]?item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr3[index].userOption})[0].value : '未选择'
							}}
						</view>
					</view>
				</view>
			</view>
			
			<view class="specific">
				<image src="@/static/img/healthStatus/lifeStyle4@2x.png" class="title"></image>
				<view class="single" v-for="(item,index) in subjectArr[3] && subjectArr[3].adTopicsRepliesEntityList" :key="index">
					<image src="@/static/img/healthStatus/questionIcon@2x.png"></image>
					<view>
						<view class="question">{{item.name}}</view>
						<view class="answer"  v-if="brr4[index] && brr4[index].userOption !== '' ">
							{{brr4[index] && brr4[index].userOption === '' ? '未选择':
								item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr4[index].userOption})[0]?item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr4[index].userOption})[0].value : '未选择'
							}}
						</view>
					</view>
				</view>
			</view>
			
			<view class="specific">
				<image src="@/static/img/healthStatus/lifeStyle5@2x.png" class="title"></image>
				<view class="single" v-for="(item,index) in subjectArr[4] && subjectArr[4].adTopicsRepliesEntityList" :key="index">
					<image src="@/static/img/healthStatus/questionIcon@2x.png"></image>
					<view>
						<view class="question">{{item.name}}</view>
						<view class="answer" v-if="brr5[index] && brr5[index].userOption !== '' ">
							{{brr5[index] && brr5[index].userOption === '' ? '未选择':
								item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr5[index].userOption})[0]?item.adTopicsRepliesEntityList.filter((a)=>{return a.elections == brr5[index].userOption})[0].value : '未选择'
							}}
						</view>
					</view>
				</view>
			</view>
			
			<view class="specific">
				<image src="@/static/img/healthStatus/lifeStyle6@2x.png" class="title"></image>
				<view class="single" v-for="(item,index) in subjectArr[5] && subjectArr[5].adTopicsRepliesEntityList" :key="index">
					<image src="@/static/img/healthStatus/questionIcon@2x.png"></image>
					<view>
						<view class="question">{{item.name}}</view>
						<view class="answer"  v-if="brr6[index] && brr6[index].userOption !== '' ">
							{{item.adTopicsRepliesEntityList.filter((a)=>{
								return brr6[index] && brr6[index].userOption && brr6[index].userOption.length > 0 && brr6[index].userOption.split(',').indexOf(a.elections) > -1
							}).map((b)=>{ return b.value}).join(',') || '未选择'}}
							
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {age,distance} from '@/static/js/filter.js'
	export default{
		data() {
			return {
				subjectArr:[],
				data:{},
				answer: [],
				userInfo: {},
				brr1: [],
				brr2: [],
				brr3: [],
				brr4: [],
				brr5: [],
				brr6: [],
				searchBarFixed: false
			}
		},
		onLoad(option) {
			const _this = this;
			if(option.id) {
				_this.question().then((reponse) => {
					_this.$api.psychologyQuestionInfo(option.id).then((res) => {
						if(res.data.returnCode == 200) {
							_this.data = res.data.result.newAppMentalHealthAssessmentEntity;
							_this.answer = res.data.result.newUserTopicsEntities;
							_this.fun2(this.answer)
							_this.$api.getUserInfo().then((res) => {
								if(res.data.returnCode == 200) {
									_this.userInfo = res.data && res.data.result
								}
							})
						}
					})
				})
			}
		},
		onPageScroll() {
			this.searchBarFixed = this.distance('mainContent');
		},
		methods:{
			age,
			distance,
			fun2(answer){
				this.brr1=[];
				this.brr2=[];
				this.brr3 = []
				this.brr4 = []
				this.brr5 = []
				this.brr6 = []
				answer.map((a,ai) => {
					if(ai <= 19) {
						this.brr1.push(a)
					}else if ( ai <= 24) {
						this.brr2.push(a)
					}else if (ai <= 30) {
						this.brr3.push(a)
					}else if (ai <= 41) {
						this.brr4.push(a)
					} else if(ai <= 46) {
						this.brr5.push(a)
					}else {
						this.brr6.push(a)
					}
				})
			},
			
			question() {
				return new Promise((success, error) => {
					this.$api.psychologyQuestion('ids=18&ids=19&ids=20&ids=21&ids=22&ids=23').then((res) => {
						if (res) {
							const data = Object.keys(res.data.result).map((a) => {
								const aData = res.data.result[a].adTopicsRepliesEntityList.map((b) => {
									b.adTopicsRepliesEntityList.map((c) => {
										c.checked = false;
										return b
									})
									return b
								})
								return res.data.result[a]
							})
							this.subjectArr = data;
							success(res.data.result)
						} else {
							error('')
						}
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/css/healthStatus/toView.scss';
</style>
